<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<meta name="format-detection" content="telephone=no"/>
<meta name="renderer" content="webkit"/>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
<title>Document</title>
<link rel="stylesheet" href="css/base.css"/>
</head>
<body ng-app="myApp">
<div class="content-view" ng-view></div>

<br/><br/><br/><br/><br/><br/>
<div ng-controller="test01_01Controller">
<div>
<content></content><br/>
<div content=""></div><br/>
<div class="content"></div><br/>
<!-- directive:content -->
<div></div><br/>
<br/>
</div>
 首页TEST
 <br/>
<span class="ng-binding">{{hello}}</span>,Angular
 <br/>
 <ul>
 <li ng-repeat="user in users">
 姓名 ： {{user.name}}<br/>
 年龄 ： {{user.age}}<br/>
 </li>
 </ul>
 <a href="javascript:void(0);" event-add-user>添加一个用户</a>
 <br/>
 <a href="#/page1.html">跳转到PAGE1</a>
 <br/>
 <a href="#/page2.html">跳转到PAGE2</a>
 <br/>
 <a href="javascript:void(0);">后退</a>
 <loader loadfun="loadData1()">加载1</loader>
 </div>
 <div ng-controller="test01_02Controller">
 <br/>
{{hello}},Angular2
 <br/>
 <loader loadfun="loadData2()">加载2</loader>
 <input type="text" ng-model="input.text"/>
 <p>您输出的是{{input.text}}</p>
 <ul>
 <li ng-repeat="user in users">
 姓名2 ： {{user.name}}<br/>
 年龄2 ： {{user.age}}<br/>
 </li>
 </ul>
  <div ng-controller="test01_03Controller">
  	这是在test01_02Controller控制器作用域下的另一个控制器test01_03Controller，他可以是用父控制器test01_02Controller的变量，如下<br/>
  	<p>您上个输入框输出的是{{$parent.input.text}}</p>这是一个非常不可靠的解决方案，因为$parent是可变的不确定的。<br/>
  	<input type="text" ng-model="input.text"/>这是一个与父作用域重名的ng-model，尽量减少这样的使用，因为会导致父作用域的重名变量(或函数)被覆盖而产生不可预知的问题<br/>
  	<p>您输出的是{{input.text}}</p>
  	<p>自身作用域下的变量:{{test0103}}</p>
	<p>自身作用域下的函数:{{testfun()}}</p>
	<p>自身函数读取本作用域下的变量:{{testfun02()}}</p>
	<p>自身函数读取父作用域下的变量:{{testfun03()}}</p>
  </div>
  <div ng-controller="test01_04Controller">
  	这是在test01_02Controller控制器作用域下的另一个控制器test01_04Controller，他可以是用父控制器test01_02Controller的变量，如下<br/>
  	<p>您上个输入框输出的是{{$parent.input.text}}</p>这是一个非常不可靠的解决方案，因为$parent是可变的不确定的。<br/>
  	<input type="text" ng-model="input.text"/>这是一个与父作用域重名的ng-model，尽量减少这样的使用，因为会导致父作用域的重名变量(或函数)被覆盖而产生不可预知的问题<br/>
  	<p>您输出的是{{input.text}}</p>
  	<p>推荐使用单一对象对作用域进行赋值，如下</p>
  	<p>自身作用域下的变量:{{test01_04ctrl.name}}</p>
	<p>自身作用域下的函数:{{test01_04ctrl.testfun()}}</p>
	<p>自身函数读取本作用域下的变量:{{test01_04ctrl.testfun02()}}</p>
	<p>自身函数读取父作用域下的变量:{{test01_04ctrl.testfun03()}}</p>
	<p>本处用于监听URL变化开始<br/><span ng-bind-html="test01_04ctrl.nowbgnurl|trusted"></span></p>
  <p>本处用于监听URL变化结束<br/><span ng-bind-html="test01_04ctrl.nowendurl|trusted"></span></p>
	<input type="button" value="改变" ng-click="test01_04ctrl.cgurl()"/><br/>
	您的名字：<input type="text" ng-model="input.name"/><br/>
	输入情况<span ng-class="{'text-warning' : input.warn()}">{{input.change()}}</span><br/>
	<button ng-disabled="!input.valid()" ng-click="input.check()">确定</button><br/>
	<button ng-click="input.setval('哈哈')">设置</button><br/>
	<button ng-click="input.reset()">重置</button><br/>
  </div>
 </div>
<!--angular在这里的时候需要更长的生效时间-->
<script src="js/lib/angular.min.js"></script>
<script src="js/lib/plugin/angular.route.js"></script>
<script src="js/lib/plugin/angular.animate.js"></script>
<script src="js/test/test01.js"></script>
</body>
</html>